<template>
  <div>
    <div>
      <statistics-user
        :userEchartData1="userEchartData1"
        :userEchartData2="userEchartData2"
      ></statistics-user>
    </div>
    <div>
      <statistics-user2
        :userEchartData3="userEchartData3"
        :userEchartData4="userEchartData4"
      ></statistics-user2>
    </div>
  </div>
</template>

<script>
import {
  selectTravelTimeForNearlyThreeMonths,
  selectScheduledTimeForNearlyThreeMonths,
  selectTravelAgeStatisticsForNearlyThreeMonths,
  selectSexRatioForNearlyThreeMonths,
} from "@/api/statistics/statisticsUser";
import statisticsUser from "../model/statisticsUserModel";
import statisticsUser2 from "../model/statisticsUserModel2";

export default {
  name: "StatisticsUser",
  components: {
    statisticsUser,
    statisticsUser2,
  },
  data() {
    return {
      userEchartData1: [],
      userEchartData2: [],
      userEchartData3: [],
      userEchartData4: [],
    };
  },
  mounted() {
    this.AxiosList();
  },
  methods: {
    AxiosList() {
      this.selectTravelTimeForNearlyThreeMonthsList();
      this.selectScheduledTimeForNearlyThreeMonthsList();
      this.selectTravelAgeStatisticsForNearlyThreeMonthsList();
      this.selectSexRatioForNearlyThreeMonthsList();
    },
    // 出行时间统计
    selectTravelTimeForNearlyThreeMonthsList() {
      selectTravelTimeForNearlyThreeMonths().then((res) => {
        delete res[0].sum;
        this.userEchartData1 = res;
      });
    },
    // 预定时间统计
    selectScheduledTimeForNearlyThreeMonthsList() {
      selectScheduledTimeForNearlyThreeMonths().then((res) => {
        this.userEchartData2 = res;
      });
    },
    // 出行年龄段统计
    selectTravelAgeStatisticsForNearlyThreeMonthsList() {
      selectTravelAgeStatisticsForNearlyThreeMonths().then((res) => {
        this.userEchartData3 = res;
      });
    },
    // 男女比例
    selectSexRatioForNearlyThreeMonthsList() {
      selectSexRatioForNearlyThreeMonths().then((res) => {
        this.userEchartData4 = res;
      });
    },
  },
};
</script>
